<div class="layui-container fly-marginTop fly-user-main">
	{include file="public/left" /}
	<div class="site-tree-mobile layui-hide">
		<i class="layui-icon"></i>
	</div>
	<div class="site-mobile-shade"></div>
	<div class="fly-panel fly-panel-user" pad20="">
		<div class="layui-tab layui-tab-brief" lay-filter="user">
			<ul class="layui-tab-title" id="LAY_mine">
				<li class="layui-this" lay-id="info">我的资料</li>
				<li lay-id="avatar">头像</li>
				<li lay-id="pass">密码</li>
				<li lay-id="bind">帐号绑定</li>
			</ul>
			<div class="layui-tab-content" style="padding: 20px 0;">
				<div class="layui-form layui-form-pane layui-tab-item layui-show">
					<form method="post">
						{if condition='$user.phone'}
						<div class="layui-form-item">
						<label for="L_email" class="layui-form-label">手机</label>
						<div class="layui-input-inline">
						<input type="text" id="L_phone" name="phone" required="" lay-verify="phone"
						autocomplete="off" value="{:$user.phone}" class="layui-input" disabled=""
						style="cursor: not-allowed !important;"/>
						</div>
						<div class="layui-form-mid layui-word-aux">
						<span style="color: #5FB878">您已完成手机号绑定，已正式成为社区实名用户。</span> 手机号暂不支持修改。
						</div>
						</div>
						{else/}
						<div class="layui-form-item"><label for="L_email" class="layui-form-label">手机</label>
							<div class="layui-input-inline"><input type="text" id="L_phone" name="phone" required=""
																   lay-verify="phone" autocomplete="off" value=""
																   placeholder="请输入手机号" class="layui-input"></div>
							<div class="layui-form-mid layui-word-aux">您需要完成手机验证才可进行社区发帖/回帖等操作</div>
						</div>
						{/if}
						<div class="layui-form-item">
							<label for="L_email" class="layui-form-label">邮箱</label>
							<div class="layui-input-inline">
								<input type="text" id="L_email" name="email" required="" lay-verify="email"
									   autocomplete="off" value="{:$user.email}" class="layui-input"/>
							</div>
							<div class="layui-form-mid layui-word-aux">
								邮箱也可以作为登入名，推荐设置。
							</div>
							<!--<div class="layui-form-mid layui-word-aux">-->
							<!--您的邮箱已激活，也可以作为登入名-->
							<!--</div>-->
						</div>
						<div class="layui-form-item">
							<label for="L_username" class="layui-form-label">昵称</label>
							<div class="layui-input-inline">
								<input type="text" id="L_username" name="nickname" required="" lay-verify="required"
									   autocomplete="off" value="{:$user.nickname}" class="layui-input"/>
							</div>
							<div class="layui-inline">
								<div class="layui-input-inline" style="width: 300px">
									<p></p>
									<input type="radio" name="sex" value="0" {:$user.sex==0 ? 'checked' : ''} title="男">
									<input type="radio" name="sex" value="1" {:$user.sex==1 ? 'checked' : ''} title="女">
								</div>
							</div>
						</div>
						<div class="layui-form-item">
							<label for="L_city" class="layui-form-label">城市</label>
							<div class="layui-input-inline">
								<input type="text" id="L_city" name="city" autocomplete="off" value="{:$user.city}"
									   class="layui-input"/>
							</div>
						</div>
						<div class="layui-form-item layui-form-text">
							<label for="L_sign" class="layui-form-label">签名</label>
							<div class="layui-input-block">
								<textarea placeholder="随便写些什么刷下存在感" id="L_sign" name="sign" autocomplete="off"
										  class="layui-textarea" style="height: 80px;">{:$user.sign}</textarea>
							</div>
						</div>
						<div class="layui-form-item">
							<button class="layui-btn" key="set-mine" lay-filter="edit" lay-submit="">确认修改</button>
						</div>
					</form>
				</div>
				<div class="layui-form layui-form-pane layui-tab-item">
					<div class="layui-form-item">
						<div class="avatar-add">
							<p>建议尺寸168*168，支持jpg、png、gif，最大不能超过50KB</p>
							<button type="button" class="layui-btn upload-img" id="upload"><i class="layui-icon"></i>上传头像
							</button>
							<img src="__STATIC__/{:session('face')}"/>
							<span class="loading"></span>
						</div>
					</div>
				</div>
				<div class="layui-form layui-form-pane layui-tab-item">
					<div class="layui-form-item">
						<label for="L_pass" class="layui-form-label">新密码</label>
						<div class="layui-input-inline">
							<input type="password" id="L_pass" name="password" required="" lay-verify="required"
								   autocomplete="off" class="layui-input"/>
						</div>
						<div class="layui-form-mid layui-word-aux">
							6到16个字符
						</div>
					</div>
					<div class="layui-form-item">
						<label for="L_repass" class="layui-form-label">确认密码</label>
						<div class="layui-input-inline">
							<input type="password" id="L_repass" name="repassword" required="" lay-verify="required"
								   autocomplete="off" class="layui-input"/>
						</div>
					</div>
					<div class="layui-form-item">
						<button class="layui-btn" key="set-mine" lay-filter="Update" lay-submit="">确认修改</button>
					</div>
				</div>
				<div class="layui-form layui-form-pane layui-tab-item">
					<ul class="app-bind">
						<li class="fly-msg  app-havebind"><i class="iconfont icon-qq"></i> <span>已成功绑定，您可以使用QQ帐号直接登录Fly社区，当然，您也可以</span>
							<a href="javascript:;" class="acc-unbind" type="qq_id">解除绑定</a></li>
						<li class="fly-msg "><i class="iconfont icon-weibo"></i> <a href="/app/weibo/" class="acc-weibo"
																					type="weibo_id"
																					onclick="layer.msg('正在绑定微博', {icon:16, shade: 0.1, time:0})">立即绑定</a>
							<span>，即可使用微博帐号登录Fly社区</span></li>
					</ul>
				</div>
			</div>
		</div>
	</div>
</div>

<script>
    //Demo
    layui.use(['form', 'upload', 'element'], function () {
        var form = layui.form;
        var upload = layui.upload;
        var element = layui.element;

        //获取hash来切换选项卡，假设当前地址的hash为lay-id对应的值
        var layid = location.hash.replace(/^#user=/, '');
        element.tabChange('user', layid); //假设当前地址为：http://a.com#test1=222，那么选项卡会自动切换到“发送消息”这一项

        //监听Tab切换，以改变地址hash值
        element.on('tab(user)', function () {
            location.hash = 'user=' + this.getAttribute('lay-id');
        });

        var uploadInst = upload.render({
            elem: '#upload' //绑定元素
            , url: '{:url("index/Set/upload")}' //上传接口
            , done: function (res) {
                location.reload();
                //上传完毕回调
            }
            , error: function () {
                //请求异常回调
            }
        });
        //监听提交
        form.on('submit(edit)', function (data) {
            $.post("{:url('index/Set/editUser')}", data.field, function (res, textStatus, xhr) {
                if (res.code == 0) {
                    layer.msg(res.msg, {icon: 9}, function () {
                    });
                } else {
                    layer.msg(res.msg, {icon: 1}, function () {
                    });
                }
            });
            return false;
        });

        form.on('submit(Update)', function (data) {
            $.post("{:url('index/Set/editPass')}", data.field, function (res, textStatus, xhr) {
                if (res.code == 0) {
                    layer.msg(res.msg, {icon: 9}, function () {
                    });
                } else {
                    layer.msg(res.msg, {icon: 1}, function () {
                    });
                }
            });
            return false;
        });
    });
</script>